import React, { Component} from 'react'
import {Form, Row, Steps, Divider, Button, Descriptions,Timeline} from "antd";

//客户管理
class ShopForm extends Component {
    componentWillReceiveProps(nextProps) {
        // !nextProps.orderVisible&&this.props.data
    }
    constructor(props) {
        super(props);
    }
    render() {
        console.log(this.props)

            const data=this.props.data
            const TimelineItem=Timeline.Item
            let goodList=data
            const { Step } = Steps;
            let descriptionItem=null
            if(goodList.deliverableList>0){
                goodList.deliverableListmap.forEach(item=>{
                    descriptionItem =<Button>{item.name}</Button>
                })
            }else{
                descriptionItem= '暂无'
            }

            return (
                <div>
                    <div id="orderForm">
                        <Row gutter={16}>
                            <Descriptions title="商品信息" layout="vertical" bordered>
                                <Descriptions.Item label="商品名称">{goodList.goodName}</Descriptions.Item>
                                <Descriptions.Item label="生产进度">{goodList.goodProcess+'%'}</Descriptions.Item>
                                <Descriptions.Item label="产品类型"> { goodList.oneTypeName }-{ goodList.twoTypeName }</Descriptions.Item>
                                <Descriptions.Item label="订购时间">{ goodList.createTime }</Descriptions.Item>
                                <Descriptions.Item label="区域选择">行政区域</Descriptions.Item>
                                <Descriptions.Item label="参数"> { goodList.timeStart }-{ goodList.timeEnd }</Descriptions.Item>
                                <Descriptions.Item label="交付物"  span={3} >
                                    {descriptionItem}
                                </Descriptions.Item>
                                <Descriptions.Item label="生产进度"  span={3} >
                                    <Timeline>
                                        {  goodList.nodeInfoList.map((item, i)=>{
                                            return   <TimelineItem  key={i} color={item.status==3 ? 'green' : item.status==0 ? 'blue' : item.status==1 ? 'yellow' :'red'}>
                                                <p>
                                                    {item.name}
                                                    <span style={{ color:item.status==3 ? 'green' : item.status==0 ? 'blue' : item.status==1 ? 'yellow' :'red'}}>{ item.statusName }</span>
                                                </p>
                                            </TimelineItem>
                                        })}
                                    </Timeline>
                                </Descriptions.Item>

                            </Descriptions>

                        </Row>
                        <Divider />


                    </div>
                </div>

            )
    }
}
export default Form.create()(ShopForm);